<%@taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<f:view>

	<%@include file="inc/head.jsp"%>


	<body>
	<!-- Panel -->
	<div id="toppanel">
	<div id="panel">
	<div class="content clearfix">
	<div class="left">
	<h1>Wie geht es dir?</h1>
	<h2>Deine Stimmung.</h2>
	<p class="grey">Bist du Gl&uuml;cklich? Sauer? W&uuml;tend? Genervt
	oder entspannt? Teil deine Stimmung mit anderen Personen.</p>
	<h2>Stimmung anderer Personen</h2>
	<p class="grey">Wer ist genauso drauf wie du? Geht es deinem besten
	Freund gut? Finde es heraus!</p>
	</div>
	<div class="left"><!-- Login Form --> <h:form id="loginForm"
		styleClass="clearfix">
		<h1>Ich bin bekannt.</h1>
		<label class="grey">Ich bin:</label>
		<h:inputText styleClass="field" value="#{personBean.username}" />
		<label class="grey">Passwort:</label>
		<h:inputText styleClass="field" value="#{personBean.password}" />
		<label><h:selectBooleanCheckbox id="rememberme" /> &nbsp;Ich
		will, dass man sich an mich errinert !</label>
		<div class="clear"></div>
		<h:commandButton styleClass="bt_login" value="Enter."
			action="#{personBean.tryToLogin}" />
	</h:form></div>
	<div class="left right"><!-- Register Form --> <h:form
		id="registerForm" styleClass="clearfix">
		<h1>Ich will bekannt werden</h1>
		<label class="grey">Ich bin:</label>
		<h:inputText styleClass="field" value="#{personBean.username}" />
		<label class="grey">Mein Passwort:</label>
		<h:inputText styleClass="field" value="#{personBean.password}" />
		<div class="clear"></div>
		<h:commandButton styleClass="bt_register" value="Registrieren"
			action="#{personBean.createPerson}" />
		<div class="clear"></div>
		<p class="grey">Hier steckt viel mehr drin als du denkst. Das muss
		du aber selber <a href="http://www.google.de" title="Google">herausfinden
		&raquo;</a></p>
	</h:form></div>
	</div>
	</div>
	<!-- /login --> <!-- The tab on top -->
	<div class="tab">
	<ul class="login">
		<li class="left">&nbsp;</li>
		<li>Hallo, Mensch</li>
		<li class="sep">|</li>
		<li id="toggle"><a id="open" class="open" href="#">Klick
		mich!</a> <a id="close" style="display: none;" class="close" href="#">Panel
		schliessen</a></li>
		<li class="right">&nbsp;</li>
	</ul>
	</div>
	<!-- / top --></div>
	<!--panel -->

	<div id="container">
	<div id="content" style="padding-top: 100px;">
	<h2>Ein bisschen Lorem ipsum dolor um die Seite zu f&uuml;llen.</h2>

	<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
	Praesent scelerisque commodo massa. Ut volutpat. Maecenas luctus augue
	quis velit. Nulla tincidunt pede in erat. Vivamus tellus. Maecenas
	lacinia, arcu sed scelerisque posuere, dui massa gravida enim, a
	vehicula erat quam et risus. Etiam scelerisque. Vivamus et ipsum. Nulla
	facilisi. Nullam elementum fringilla enim. Nulla facilisi. Praesent sem
	arcu, porttitor ac, cursus sed, fringilla vitae, nisi. Nam sollicitudin
	eros id ante. Nunc nisi augue, lobortis a, rhoncus quis, gravida nec,
	tortor. Sed sollicitudin. Nulla facilisi.</p>

	<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
	Praesent scelerisque commodo massa. Ut volutpat. Maecenas luctus augue
	quis velit. Nulla tincidunt pede in erat. Vivamus tellus. Maecenas
	lacinia, arcu sed scelerisque posuere, dui massa gravida enim, a
	vehicula erat quam et risus. Etiam scelerisque. Vivamus et ipsum. Nulla
	facilisi. Nullam elementum fringilla enim. Nulla facilisi. Praesent sem
	arcu, porttitor ac, cursus sed, fringilla vitae, nisi. Nam sollicitudin
	eros id ante. Nunc nisi augue, lobortis a, rhoncus quis, gravida nec,
	tortor. Sed sollicitudin. Nulla facilisi.</p>
	</div>
	<!-- / content --></div>
	<!-- / container -->
	</body>
	</f:view>
</html>

